<template>
  <el-dialog
    :title="plugin.lang('supplier_order.title')"
    v-model="show"
    :width="1000"
  >
    <el-table :data="list" style="width: 100%;">
      <el-table-column :label="plugin.lang('supplier_order.code')" min-width="150">
        <template #default="scope">
          {{ scope.row.order.code }}
        </template>
      </el-table-column>
      <el-table-column :label="plugin.lang('supplier_order.name')" min-width="150">
        <template #default="scope">
          {{ scope.row.order.name }}
        </template>
      </el-table-column>
      <el-table-column :label="plugin.lang('supplier_order.count')" align="center" width="150">
        <template #default="scope">
          <el-link type="primary" href="javascript:;">{{ scope.row.count }}</el-link>
        </template>
      </el-table-column>
      <el-table-column :label="plugin.lang('supplier_order.price')" align="center" width="120">
        <template #default="scope">
          {{ money(scope.row.price) }}
        </template>
      </el-table-column>
      <el-table-column :label="plugin.lang('supplier_order.total')" align="center" width="120">
        <template #default="scope">
          {{ money(scope.row.total) }}
        </template>
      </el-table-column>
      <el-table-column :label="plugin.lang('supplier_order.time')" align="right" min-width="150">
        <template #default="scope">
          {{ time.format(scope.row.created_at) }}
        </template>
      </el-table-column>
    </el-table>
    <div class="page">
      <el-pagination
        @current-change="onPage"
        :current-page="where.page"
        :page-size="where.page_size"
        layout="total, prev, pager, next, jumper"
        :total="where.page_total"
        >
      </el-pagination>
    </div>
  </el-dialog>
</template>
<script>
import { ref } from 'vue'
import app from '@/app'
import { goods } from '@/api/erp/supplier_order'

export default {
  setup() {
    // 对话框
    const show = ref(false)

    // 列表
    const list = ref([])
    // 条件 
    const where = ref({})

    // 获取数据
    const getData = () => {
      // 查询
      goods(where.value.id, where.value).then(res => {
        list.value = res.data
        where.value.page = res.current_page
        where.value.page_size = res.per_page
        where.value.page_total = res.total
      })
    }

    // 打开
    const open = id => {
      show.value = true

      // 放置ID
      where.value.id = id
      
      // 加载第一页
      onPage(1)
    }

    const onPage = page => {
      where.value.page = page
      getData()
    }

    return {
      time: app.time,
      money: app.money,
      plugin: app.plugin.index,
      show,
      open,
      list,
      where,
      onPage
    }
  }
}
</script>